<template>
  <div style="margin-top: 16px">
    <avue-form
        ref="configForm"
        :key="formKey"
        :option="taskCandidateOption"
        v-model="formModel"
        @change="formModelChange"
    ></avue-form>

  </div>
</template>

<script>
import actTaskCandidateOption from "./actTaskCandidateOption";
import {deepClone} from "utils/util";


export default {
  name: "startActTaskCandidateConfig",
  components: {},
  computed: {
    taskCandidateOption() {
      return actTaskCandidateOption.getCandidateUserOption(this)
    },
  },
  props: {
    id: String,
    modelValue: {
      type: Object,
      required: true,
    },
  },

  watch: {
    modelValue: function (val) {
      if (val === this.formModel) {
        return
      }

      this.initFormModel(val)
    }
  },
  data() {
    return {
      formModel: {},
      formKey: Math.random()
    }
  },
  created() {
    this.initFormModel(this.modelValue)
  },
  methods: {
    initFormModel(val) {
      this.formModel = deepClone(val);
      this.formKey = Math.random()
    },
    formModelChange(val) {
      this.formModel = val;
      this.$emit("update:modelValue", val)
    },
  }

};
</script>
